<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="utf-8"/>
    <title>Sender-${interface_name}</title>
    <meta name="description" content="send"/>
    <link rel="stylesheet" type="text/css" href="${ctx}/static/css/config.css"/>
</head>
<body>
<div class="config-block">
    <form action="${ctx}/message/send" method="post" enctype="multipart/form-data">
        <div class="config-block">
            <div class="config-item">
                <span class="config-item-title">Initial Context Factory</span>
                <input class="config-item-input" type="text" id="initial_context_factory" name="initial_context_factory" title="Initial Context Factory"
                       value="com.tibco.tibjms.naming.TibjmsInitialContextFactory"/>
            </div>
            <div class="config-item">
                <span class="config-item-title">Connection URL</span>
                <input class="config-item-input" type="text" id="connection_url" name="connection_url" title="Connection URL" value="${connection_url}"/>
            </div>
            <div class="config-item">
                <span class="config-item-title">Connection Factory</span>
                <input class="config-item-input" type="text" id="connection_factory" name="connection_factory" title="Connection Factory" value="${connection_factory}"/>
            </div>
            <div class="config-item">
                <span class="config-item-title">Enter Queue Name</span>
                <input class="config-item-input" type="text" id="queue_name" name="queue_name" title="Queue Name" value="${queue_name}"/>
            </div>
            <div class="config-item">
                <span class="config-item-title">Username</span>
                <input class="config-item-input" type="text" id="username" name="username" title="Username" value="${username}"/>
            </div>
            <div class="config-item">
                <span class="config-item-title">Password</span>
                <input class="config-item-input" type="text" id="password" name="password" title="Password" value="${password}"/>
            </div>
            <div id="prop_div">
                <c:choose>
                    <c:when test="${empty prop_names}">
                        <div class="config-item">
                            <span class="config-item-title">Properties</span>
                            <input class="config-item-input" style="width: 29%" type="text" id="prop_name" name="prop_name" title="Property Name" value="${prop_name}"/>
                            <input class="config-item-input" style="width: 30%" type="text" id="prop_value" name="prop_value" title="Property Value" value="${prop_value}"/>
                            <img src="${ctx}/static/image/add.png" style="height: 16px; width: 16px;vertical-align: middle;" onclick="addNewKeyValueProp()"/>
                        </div>
                    </c:when>
                    <c:otherwise>
                        <c:forEach items="${prop_names}" var="prop_name" varStatus="status">
                            <c:choose>
                                <c:when test="${status.index == 0}">
                                    <div class="config-item">
                                        <span class="config-item-title">Properties</span>
                                        <input class="config-item-input" style="width: 29%" type="text" id="prop_name" name="prop_name" title="Property Name" value="${prop_name}"/>
                                        <input class="config-item-input" style="width: 30%" type="text" id="prop_value" name="prop_value" title="Property Value" value="${prop_values[status.index]}"/>
                                        <img src="${ctx}/static/image/add.png" style="height: 16px; width: 16px;vertical-align: middle;" onclick="addNewKeyValueProp()"/>
                                    </div>
                                </c:when>
                                <c:otherwise>
                                    <div class="config-item">
                                        <span class="config-item-title">Properties</span>
                                        <input class="config-item-input" style="width: 29%" type="text" id="prop_name" name="prop_name" title="Property Name" value="${prop_name}"/>
                                        <input class="config-item-input" style="width: 30%" type="text" id="prop_value" name="prop_value" title="Property Value" value="${prop_values[status.index]}"/>
                                        <img src="${ctx}/static/image/delete.png" style="height: 16px; width: 16px;vertical-align: middle;" onclick="deleteKeyValueProp(this)"/>
                                    </div>
                                </c:otherwise>
                            </c:choose>
                        </c:forEach>
                    </c:otherwise>
                </c:choose>
            </div>
            <div class="config-item">
                <span class="config-item-title">Message Content</span>
                <textarea class="config-item-content" id="message_content" name="message_content"
                          title="Message Content. If this field has input, message file will be ignored.">${message_content}</textarea>
            </div>
            <div class="config-item">
                <span class="config-item-title">Message File</span>
                <input class="config-item-input" type="file" id="message_file" name="message_file" title="Message File" />
            </div>
            <div class="config-item">
                <span class="config-item-title">Review Message</span>
                <input class="config-item-checkbox" type="checkbox" id="review_message" name="review_message" title="Review Message" checked />
            </div>
            <div class="config-item">
                <span class="config-item-title">Rollback If Success</span>
                <input class="config-item-checkbox" type="checkbox" id="rollback_mark" name="rollback_mark" title="rollback_mark" />
            </div>
            <div class="config-item">
                <span class="config-item-title">Submit</span>
                <button type="submit" id="submitBtn" name="submitBtn">Send Message To Queue</button>
            </div>
            <div class="config-item">
                <span class="config-item-title">Error Message</span>
                <textarea class="config-item-error" id="error_message" name="error_message" title="Error Message">${error_message}</textarea>
            </div>
            <input type="hidden" id="interface_name" name="interface_name" value="${interface_name}">
        </div>
    </form>
</div>
<span style="clear:both; z-index:1000; overflow:hidden; bottom:10px; left:5px;position:fixed !important;color: #e9e9e9">Author: Charkey@ODC;Cooperator: 大头森@ODC</span>
<script type="application/javascript" src="${ctx}/static/jquery-2.0.3.min.js"></script>
<script type="application/javascript">
    function selectQueueName() {
        $("#queue_name").val($("#queue_name_list").find("option:selected").text());
    }
    function addNewKeyValueProp() {
        $("div#prop_div").append(
                "<div class=\"config-item\">" +"\n"+
                "<span class=\"config-item-title\">Properties</span>" +"\n"+
                "<input class=\"config-item-input\" style=\"width: 29%\" type=\"text\" id=\"prop_name\" name=\"prop_name\" title=\"Property Name\" value=\"${prop_name}\"/>" +"\n"+
                "<input class=\"config-item-input\" style=\"width: 30%\" type=\"text\" id=\"prop_value\" name=\"prop_value\" title=\"Property Value\" value=\"${prop_value}\"/>" +"\n"+
                "<img src=\"${ctx}/static/image/delete.png\" style=\"height: 16px; width: 16px;vertical-align: middle;\" onclick=\"deleteKeyValueProp(this)\"/>" +"\n"+
                "</div>");
    }
    function deleteKeyValueProp(element) {
        element.parentNode.parentNode.removeChild(element.parentNode);
    }
</script>
</body>
</html>

